*{
	padding: 0;
	margin: 0;
	list-style: none;
}
html,body{
	width: 100%;
	height:630px;
	overflow: hidden;	
}
body{
	padding: 30px;
}
.disclick{
	pointer-events: none;
}
.btn-reset:hover{
	background: #35D6C0;
}
.btn-reset{
	border: none;
	outline: none;
	border-radius: 4px;
}
.album-nav{
	height: 40px;
	width: 100%;
}
.return-album{
	height: 40px;
	width: 110px;
	float: left;
	background: #F38181;
	color: white;
	line-height: 40px;
	text-align: center;
	border-radius: 4px;
	letter-spacing: 3px;
}
.return-album:hover{
	background: #35D6C0;
}
.album-nav-right{
	width: 300px;
	height: 40px;
	float: right;
}
.add-pic{
	height: 40px;
	width: 120px;
	float: left;
	color: white;
	line-height: 40px;
	text-align: center;
	border-radius: 4px;
}
.delete-album{
	height: 40px;
	width: 120px;
	float: right;
	color: white;
	line-height: 40px;
	text-align: center;
	border-radius: 4px;
}
.pic-create{
	height: 40px;
	width: 120px;
	background: #F38181;
	font-size: 16px;
	letter-spacing: 2px;
	
}
.create-modal{
	padding: 20px;
}
.create-top{
	height: 40px;
}
.create-dis{
	height: 40px;
	width: 120px;
	background: #95e1d3;
	color: white;
	float: left;
	line-height: 40px;
	text-align: center;
	letter-spacing: 3px;
}
.create-close{
	height: 40px;
	width: 40px;
	background: #35D6C0;
	color: white;
	float: right;
	line-height: 40px;
	text-align: center;
	cursor: pointer;
}
.inform{
	margin-top: 30px;
}
.form-tap{
	color: white;
	height: 40px;
	width: 120px;
	line-height: 40px;
	text-align: center;
	background: #95e1d3;
	letter-spacing: 3px;
}
.pic-href{
	height: 40px;
	background: #95e1d3;
	color: white;
	width: 200px;
	margin: 0 auto;
	line-height: 40px;
	text-align: center;
}


.album-discribe{
	height: 40px;
	line-height: 40px;
	position: relative;
	/* background:#fff ; */
	margin-top: 30px;
	/* box-shadow: 0 6px 12px rgba(0, 0, 0, 0.18); */
	border-bottom: 2px solid #fff;
	border-radius: 4px;
	letter-spacing: 3px;
	overflow: hidden;
}
.album-edt{
	width: 40px;
	background: #E9FBDB;
	
}
.album-edt span{
	font-size: 25px;
	color: #000;
}
.discribe-edt:focus{
	outline: none !important;
}
.edit-val{
	color: #9ca6a8;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding-left: 30px;
}
.edit-btn{
	position: absolute;
	top: 0;
	right: 0;
	width: 120px;
	height: 40px;
	text-align: center;
	color: white;
	border-radius: 4px;
}
.pic-dis{
	width: 500px;
	margin: 0 auto;
}
.pic-dis > textarea{
	height: 100px;
}
.image-box{
	width: 100%;
	height: 360px;
	margin-top: 30px;
	padding: 0;
}
.img-list1{
	height: 150px;
}
.img-list2{
	height: 150px;
	margin-top: 30px;
}
.img-frame{
	height: 150px ;
	width: 100%;
	display: inline-block;
	overflow: hidden;
	border: 10px solid #fff ;
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.18);
	background-image: url(../images/img-bg.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}
.img-frame > img{
	width: 100%;
	cursor: pointer;
}
.album-botoom{
	width: 120px;
	margin: 30px auto 0;
	height: 40px;
	line-height: 40px;
	font-size: 16px;
	text-align: center;
	color: #fff;
	background: #F38181;
	letter-spacing: 3px;
	border-radius: 4px;
}
.album-botoom:hover{
	background: #35D6C0;
}
.another-batch{
	display: inline-block;
	width: 120px;
	height: 40px;
	cursor: pointer;
}
/* 弹出框主要css */
.pic-modelBox,
.delete-modelBox,
.dis-modelBox
{
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,.3);
	z-index: 10000;
	display: none;
}
.insideBox,
.deleteInside,
.discribeInside
{
	background-color: #E9FBDB;
	position: absolute;
	width: 900px;
	height: 300px;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 30%;
	left: 0;
	overflow: hidden;
	box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
	padding: 30px;
	border-radius: 6px;
	display: none;
}
.insideBox{
	height: 400px;
}
.img-name{
	overflow: hidden;
	height: 40px;
	border-bottom: 2px solid #fff;
}
.chose-img{
	height: 40px;
	width: 500px;
	line-height: 40px;
	margin: 0 auto;
	background: #E9FBDB;
	border-radius: 4px;
	color: #9ca6a8;
	text-align: left;
	padding-left: 10px;
}
.deleteInside{
	height: 150px;
}
.control-yes,
.control-no,
.delete-yes,
.delete-no,
.edt-yes,
.edt-no
{
	height: 50px;
	width: 120px;
	line-height: 50px;
	text-align: center;
	background: #f38181;
	border: none;
	outline: none;
	cursor: pointer;
	letter-spacing: 3px;
}
.control-no,
.delete-no,
.edt-no
{
	background: #35D6C0;
}
.create-control{
	height: 50px;
	width: 500px;
	margin: 30px auto;
}
.pic-insideTips,
.delete-insideTips,
.dis-insideTips
{
	width: 300px;
	height: 200px;
	background-color: #fff;
	position: absolute;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 40%;
	left: 0;
	display: none;
	box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
	border-radius: 6px;
}
.pic-Ikonw,
.delete-Ikonw,
.dis-Ikonw
{
	height: 40px;
	width: 100px;
	margin:auto;
	background: #F38181;
	text-align: center;
	line-height: 40px;
	position: absolute;
	top: 50%;
	right: 0;
	bottom: 0;
	left: 0;
	color: white;
	border-radius: 4px;
	cursor: pointer;
	letter-spacing: 3px;
	
}
.pic-tipsInformation,
.delete-tipsInformation,
.dis-tipsInformation
{
	height: 40px;
	width: 250px;
	background: #95e1d3;
	line-height:40px;
	text-align: center;
	color: white;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 30%;
	left: 0;
	margin: auto;	
	letter-spacing: 3px;
}
.pic-href{
	height: 40px;
	color: white;
	width: 150px;
	margin: 0 auto;
	line-height: 40px;
	text-align: center;
}
#f1{
	display: none;
}
#f2{
	display: inline-block;
	width: 150px;
	height: 40px;
	border-radius: 4px;
	letter-spacing: 3px;
	background: #F38181;
	cursor: pointer;
	
}
#f2:hover{
	background: #35D6C0;
}
/* 遮罩层主要css */
#pictureViewer{
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,.3);
	z-index: 10000;
	/* 遮罩层 */
}
#pictureViewer img{
	max-width: 100%;
	max-height: 100%;
}
.content{
	background-color: #E9FBDB ;
	position: absolute;
	width: 600px;
	height: 600px;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 10%;
	left: 0;
	/* 模态框 */
}
 .menu-bar{
	width: 100%;
	/* 模态框顶部 */
}
 .handel:hover{
	background-color: #ff2e67;
	transition: all .3s;
}
.close-view{
	background: #F38181;
	background-size: 15px;
	text-align: center;
	line-height: 40px;
	color: #fff;
	width: 40px;
	height: 40px;
	cursor: pointer;
}
.close-view:hover{
	background-image: url(images/icons/close_white.png);
}
.handel-prev,
.handel-next{
	display: inline-block;
	width: 40px;
	height: 50px;
	position: relative;
	top: calc(50% - 80px);
	cursor: pointer;
	transition: all .3s;
/* 	background: #95e1d3; */
	line-height: 50px;
	text-align: center;
	color: #000;
	font-size: 19px;
}
/* .handel-prev:hover,
.handel-next:hover{
	background-color: #F38181;
} */
.picture-content{
	display: inline-block;
	width: 80%;
	height: calc(100% - 80px);
	position: absolute;
	margin: 0 auto;
	left: 0;
	right: 0;
}
.cover{
	position: absolute;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.counter{
	position: absolute;
	top: 0;
	right: 50px;
	height: 40px;
	line-height: 40px;
	width: 40px;
	background:#f38181;
	text-align: center;
	color: #fff;
	font-size: 15px;
	color: white;
	letter-spacing: 3px;
	cursor: pointer;
}
.hide{
	display: none;
}
.left{
	float: left;
}
.right{
	float: right;
}
.clear-flex{
	clear: both;
}
